<template>
    <div>
        <div>
            <el-page-header class="head" @back="goBack" :content="content">
            </el-page-header>
        </div>
        <el-tree :data="data" show-checkbox default-expand-all node-key="id" :default-checked-keys="permissionIds"
            ref="tree" @check="handleCheckChange" highlight-current>
        </el-tree>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                data: [],
                permissionIds:[],
                content:'权限修改'
            }
        },
        async created() {
            let res = await this.$http.get('permission/select')
            let data = res.data;
            this.data = data;
            console.log(res)
            // for (let i = 0; i < data.length; i++) {
            //     this.data.push(
            //         {
            //             id: data[i].id,
            //             label: data[i].label,
            //             children: data[i].children,
            //         }
            //     )
            // }
            
            let res1 = await this.$http.get('user/info?id='+this.$route.params.id)
            this.permissionIds = res1.data.permissionIds;
            console.log(res1)

        },
        computed: {
            // 仅读取
           
        },


        methods: {
             goBack() {
                    javascript:history.back(-1);
                },
            async handleCheckChange() {
                let res = this.$refs.tree.getCheckedNodes()
                let arr = []
                console.log(res)
                res.forEach((item) => {
                    arr.push(item.id)
                })
                let res1 = await this.$http.post('permission/batch', {
                    user_id: this.$route.params.id,
                    ids: arr,
                })
                // console.log(res1)
                // let res2 = await this.$http.get('user/info?id=' + this.$route.params.id)
                // let data2 = res2.data;
                // console.log(data2)

            },

        },
    }
</script>
<style scoped>
.head{
    margin: 20px;
}
</style>